<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>


<title>POS收单运营管理平台</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link href="<s:url value="/css/common.less"/>" type="text/less"
	rel="stylesheet" />
	<link href="<s:url value="/css/common.css"/>" type="text/css"
	rel="stylesheet" />

<script type="text/javascript"
	src="<s:url value="/js/jquery-1.3.2.js" />"></script>
<script type="text/javascript"
	src="<s:url value="/js/jquery-1.9.1.js" />"></script>
<script type="text/javascript"
	src="<s:url value="/js/jquery.blockUI.js" />"></script>
<script type="text/javascript"
	src="<s:url value="/js/jquery.validate.min.js" />"></script>
<script type="text/javascript"
	src="<s:url value="/js/pwms.validate.js?v13" />"></script>
<script language="javascript" type="text/javascript"
	src="<s:url value="/js/My97DatePicker/WdatePicker.js"/>"></script>

<style type="text/css">

.error {
	color: red;
}

</style>
<style>　　
  	#test{width: 212px; padding: 2px; height: 22px; border: 1px solid #ddd; margin: 0 5px 0 0;display:none;}
	#test option{padding: 2px 5px;}
	#test option:first-child{display: none;} 
	 #pre{position:relative;} 
	#itest{
		background: url("../images/select.jpg") no-repeat scroll right center; 
		border: 1px solid #797979;
	    cursor: default;
	    height: 22px;
	    padding: 2px;
	    width: 166px;
    }
	#itest:focus{cursor: pointer;}
	#dtest{
		 background: white; 
	    border: 1px solid gray;
	    border-radius: 0 0 3px 3px;
	    display: none;
	    height: 300px;
	    overflow-y: auto;
	    position: absolute; 
	    top: 28px;
	    width: 200px;
	}
	.soption{display: block; padding: 2px 5px;}
	.soption:hover{background: lightgray; border-top: 1px dotted #ddd; border-bottom: 1px dotted #ddd; padding: 1px 5px;}
</style>
<script type="text/javascript">

	$(document).ready(function() {
		
		var input = '<div id="pre"  ><input id="itest" name="hide" autocomplete="off" type="text" placeholder="---请选择---"><b> <font color="red">*</font></b>'; 
		var strDiv = '<div id="dtest" >';
		var strSpan = '';
		var L = $('#test option').size();
		for(var i = 1; i < L; i ++){
			strSpan += '<span class="soption" data-val="'+ $('#test option').eq(i).attr('value') +'">' + $('#test option').eq(i).html() + '</span>';
		}
		strDiv += strSpan + '</div></div>';
		$('#test').after(input + strDiv);
		
		//初始化结束
		$(document).on('focus','#itest',function(){//获得焦点，模仿select，显示模拟下拉框
			var st = $(this).val().trim();
			if(st == ''){
				$('#dtest').html(strSpan);
			}
			else{
				var strDiv2 = '';
				for(var i = 0; i < L; i ++){
					var html = $('#test option').eq(i).html();
					if(html.match(st)){
						strDiv2 += '<span class="soption" data-val="'+ $('#test option').eq(i).attr('value') +'">' + $('#test option').eq(i).html() + '</span>';
					}
				}
				$('#dtest').html(strDiv2);
			}
			$('#dtest').slideDown(250);
		});

		$(document).on('blur','#itest',function(){//失去焦点，隐藏模拟下拉框
			$('#dtest').slideUp(50);
		});

		$(document).on('keyup','#itest',function(){//输入信息，自动匹配，暂时不支持鼠标右键
			var st = $(this).val().trim();
			if(st == ''){
				$('#dtest').html(strSpan);
				return false;
			}
			var strDiv2 = '';
			for(var i = 0; i < L; i ++){
				var html = $('#test option').eq(i).html();
				if(html.match(st)){
					strDiv2 += '<span class="soption" data-val="'+ $('#test option').eq(i).attr('value') +'">' + $('#test option').eq(i).html() + '</span>';
				}else{
				   $("#test").val("0");
				}
			}
			$('#dtest').html(strDiv2);
			
		});

		$(document).on('mousedown','.soption',function(){//选择下拉选项
			var html = $(this).html();
			var val = $(this).data('val');
			$('#itest').val(html).data('val',val).blur();
			$('#test').val(val);
		});
		
		
		$("#assign").validate({
			debug : true,
			submitHandler : function(form) {
				$("#btnAdd").attr("disabled",true);
					form.submit();
			},
			rules : {
				"hide" : {required : true}																				
			},
			messages : {
				"hide" : {required : "必选"}			 
			},errorPlacement: function(error, element) { 
			    if ( element.is(":radio") ) 
			        error.appendTo ( element.parent() ); 
			    else if ( element.is(":checkbox") ) 
			        error.appendTo ( element.parent() ); 
			    else if ( element.is("input") ) {
			    	error.appendTo ( element.parent() ); 
			    }
			    else 
			        error.insertAfter(element); 
			} 

		});
	});
</script>



</head>

<body>
			<s:form id="assign" action="/formalMerinfo/merInfoAssgin.ct" method="post"  theme="simple"  >
				<table width="100%" class="tb" >
			        <tr class="tb-line">
			            <td class="tb-td" colspan="6">
				            <div class="tb-h2">POS收单运营管理平台</div>
					   	</td>
			        </tr>
	                <tr class="tb-line bg-gray">
			            <td class="tb-td" colspan="6"><div class="tb-h3">
			            	商户分配给代理商
			            </div></td>
			        </tr>
					<tr class="tb-line">
						<td align="right" class="tb-td" style="width:110px;">
				        	<div class="tb-h4">商户号：</div>
			            </td>
			            <td class="tb-td" >
							<s:property value="merinfo.id"/>
							<s:hidden name="merinfo.id"></s:hidden>
						</td>					
					     <td align="right" class="tb-td" style="width:110px;">
				        	<div class="tb-h4">原所属代理商：</div>
			            </td>
			            <td class="tb-td" >
							<s:property value="#request.oldAgent.realName"/>
							<s:hidden name="oldAgentId" value="%{#request.oldAgent.id}"></s:hidden>
						</td>
				    	<td width="12%" style="min-width: 150px" align="right" class="tb-td">
				 	 <div class="tb-h4">分配新代理商：</div>
				 	 </td>
					<td class="tb-td">
					<label class="tb-select">
					<s:select name="newAgentId" id="test" list="#request.agentList" listKey="id"  listValue="realName" headerKey="" headerValue="请选择" cssStyle="display:none"></s:select> 		
					</label>
					</td>
					</tr>						
				</table>		
		      <table width="100%" border="0" cellspacing="0" class="table">
		           	<tr class="tb-line">
						<td colspan="6" align="center"><span style="color: red"><s:actionerror /></span>
							<span style="color: red;"><s:actionmessage /></span > <span style="color: red;"><s:fielderror
									cssClass="fieldError" /></span>
							<span id="otherError"></span>
						</td>
					</tr>
					<tr class="tb-line">
			            <td class="tb-td line-submit" align="center" colspan="4">
			                <label class="tb-input-submit">		                
			                	<s:submit id="btnAdd" value="保  存" />								
							</label>
			                <label class="tb-input-submit">
								<input type="reset" value="取  消"/>
							</label>
							<label class="tb-input-submit">
								<input type="button" value="返回" onclick="history.back()"/>
							</label>
						</td>
					</tr>
            </table>
			</s:form>	
</body>
</html>
